<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">

    <title>My JSP 'role_add.jsp' starting page</title>
    <%@ include file="top.jsp" %>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
        <link rel="stylesheet" type="text/css" href="styles.css">
        -->
</head>

<body>
<script type="text/javascript">
    jQuery(function () {

        $('form[name="add"] input[name="areaName"]').validatebox({
            required: true,
            validType: ['length[2,30]', 'cityAreaNameRepetition'],
            missingMessage: '请输入区域名',
            //invalidMessage : '区域名长度为2-30 位'
        });

        $('form[name="add"] #cityName').combobox({
            mode: 'remote',
            //editable :       false,
            required: true,
            invalidMessage: '请选择城市',
            panelHeight: 'auto',
            url: 'cityAction!getAllCityName',
            method: 'post',
            valueField: 'name',
            textField: 'name',
            onSelect: function () {
                var value = $('form[name="add"] #cityName').combobox('getText')
                $("#landmarks").combobox({
                    mode: 'remote',
                    //editable :       false,
                    required: true,
                    invalidMessage: '请选择主要地标',
                    panelHeight: 'auto',
                    url: 'cityAction!getLandmarks?cityName=' + value,
                    method: 'get',
                    valueField: 'cityId',
                    textField: 'landmarks',
                })
            },
        });

    })
</script>

<form id="add" name="add" style="margin:0;padding:5px 0 0 20px;color:#333;">
    <table border="0">
        <input type="hidden" class="textbox" name="cityId" id="cityId" value=""/>
        <tr>
            <td>所在城市</td>
            <td><input type="text" class="easyui-combobox" name="cityName" id="cityName"/></td>
        </tr>
        <tr>
            <td>主要地标</td>
            <td><input type="text" class="easyui-combobox" name="landmarks" id="landmarks"/></td>
        </tr>
        <tr>
            <td>区域名称</td>
            <td><input type="text" class="textbox" name="areaName" id="areaName" value=""/></td>
        </tr>
    </table>
</form>


</body>
</html>
